<template>
    <div class="newlist">
      <div class="header-warpper" @click="$router.back(-1)">
         <img src="../../assets/l_jt.png" style="margin-top: -.16rem;" alt="">
         <span>官方公告</span> 
       </div>
       <ul class="mui-newslist-container" v-for="(item, index) in items" :key="index">
           <li class="mui-newlist-item">
               <router-link 
                    :to="{  
                            path: 'news',     
                            params: {   
                                id: item.article_id, // orderNum : this.searchData.orderNo
                            },  
                            query: {  
                               id: item.article_id, // orderNum : this.searchData.orderNo
                            }  
                        }"
               >
               <h3>{{item.title}}</h3> 
               <span class="font-lightGray-30">{{item.create_time}}</span>
               </router-link>
           </li>
        </ul>
      <div style="height:1.333333rem"></div>
      <Tabbar :idx="5"/>
    </div>
    
</template>

<script>
// @ is an alias to /src
import Tabbar from '@/views/public/Tabbar.vue'

export default {
  name: 'newlist',
  components: {
    Tabbar
  },
   data() {
    return {
        size: 50,
        offset: 100,
        indexs:0,
        btn: ['当前委托','历史委托','成交明细'],
        items:[],
    }
  },
  created:function(){

    this.getDate();

  },
  mounted () {
      
  },
  methods: {


    getDate() {

        // var page = 1;
        // var limit = 10;

        
        this.$axios.post("/index/apiindex/articleList",{})
        .then(res => {
            console.log(res)
            if(res.data.code == 0){



                if(res.data.info.length > 0){
                    
                    this.items = res.data.info;
            
                }else{

                    // console.log(1)
                    alert('暂无记录');
                }

            }else{

                alert(res.data.message);
            }
          
            
        })

    },
    

    //   onFetcha() {
    //     let items = []
    //     return new Promise((resolve) => {
    //         // 模拟请求 50 条数据，因为 size 设置为 50
    //         setTimeout(() => {
    //         for (let i = 0; i < 50; i++) {
    //             items.push({
    //             id: i,
    //             avatar: 'https://s3.amazonaws.com/uifaces/faces/twitter/danpliego/128.jpg',
    //             msg: '123',
    //             time: 'Thu Oct 25 2018 15:02:12 GMT+0800 (中国标准时间)'
    //             })
    //         }
    //         resolve(items)
    //         }, 1000)
    //     })
    //    },
    //    handleClick(data) {
    //     console.log('Item:' + data)
    //    },
    tab(str){
        this.indexs = str;
        
    }
  },
  // filters: {
  //      formatDate: function (value) {
  //       console.log(value)

  //       let date = new Date(value*1000);
  //       let y = date.getFullYear();
  //       let MM = date.getMonth() + 1;
  //       MM = MM < 10 ? ('0' + MM) : MM;
  //       let d = date.getDate();
  //       d = d < 10 ? ('0' + d) : d;
  //       let h = date.getHours();
  //       h = h < 10 ? ('0' + h) : h;
  //       let m = date.getMinutes();
  //       m = m < 10 ? ('0' + m) : m;
  //       let s = date.getSeconds();
  //       s = s < 10 ? ('0' + s) : s;
  //       return  y + '-' + MM + '-' + d ;
  //     },
      
  //   },
}
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped lang="less">
    .f-flex{
        display: flex;
        display: -webkit-flex;
        align-items: center;
    }
    .newlist{ 
        .mui-newslist-container {
            padding-left:.4rem;
            .mui-newlist-item {
                text-align: left;
                padding: .4rem;
                padding-left: 0;
                border-bottom: 1px solid #e9ebf3;
                a{
                    padding: 0.1rem 0;
                    display: inline-block;
                }
                h3 {
                    text-align: left;
                    font-weight: bold;
                    color: #10131e;
                    font-size: .48rem;
                    padding-bottom: .3rem;
                    line-height: 1;
                    overflow: hidden;
                    text-overflow: ellipsis;
                    white-space: nowrap;
                    height: .6rem;
                    line-height: .6rem;
                }
                .font-lightGray-30 {
                    font-size:.4rem;
                    color: #aab2ca;
                    text-align: left;
                }
            }
        }
    }
</style>

